<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/tabdemo.css"/>
		<script src="js/jquery-3.6.0.js"></script>
		<script>
		$(function(){
			function a(b){
				$($(".hd li").eq(b)).mouseenter(function(){
					$(this).stop().fadeTo(500,1).css({"color":"red","background":"#fff","border-bottom":"1px","solid":"#fff","color":"#c00"});
					$(this).stop().siblings("li").css({"color":"black","border-bottom":"0px"});//199100214 张涛
					$(this).stop().siblings("li").fadeTo(500,0.4);
					$(this).fadeTo(500,1);
					$($(".bd ul").eq(b)).stop().show();
					$($(".bd ul").eq(b)).stop().siblings("ul").hide();
					}); 
			/* 	$($(".hd li").eq(b)).mouseenter(function(){
					$(this).fadeTo(500,1);
				}); */
			}
			a(0);
			a(1);
			a(2);
			a(3);
			a(4);
			$(".tabox").mouseleave(function(){
				$(".hd li").fadeTo(500,1);
			})
			/* $($(".hd li").eq(1)).mouseenter(function(){
				$(this).fadeTo(500,1).css("color","red");
				$(this).siblings("li").css("color","black");
				$(this).siblings("li").fadeTo(500,0.4);
				$($(".bd ul").eq(1)).show();
				$($(".bd ul").eq(1)).siblings("ul").hide();
				}); */
			/* 	$()
						$($(".bd ul").eq(0)).hide(100)
						$($(".bd ul").eq(1)).show(100)
						*/
					
					
		});
			
		</script>
	</head>
	<body>
		<div class="tabox">
		      <div class="hd">
		        <ul>
		          <li class="on">疯狂抢购</li>
		          <li class=" ">猜您喜欢</li>
		          <li class=" ">热卖商品</li>
		          <li class=" ">热评商品</li>
		          <li class=" ">新品上架</li></ul>
		      </div>
		      <div class="bd">
		        <ul class="lh">
		          <img src="img/p1.jpg" >
		        </ul>
		        <ul class="lh" style="display: none;">
		          <img src="img/p2.jpg" >
		        </ul>
		        <ul class="lh" style="display: none;">
		          <img src="img/p3.jpg" >
		        </ul>
		        <ul class="lh" style="display: none;">
		          <img src="img/p4.jpg" >
		        </ul>
		        <ul class="lh" style="display: none;">
		          <img src="img/p5.jpg" >
		        </ul>
		      </div>
		    </div>
	</body>
</html>
